export default (tinymce) => {
  var setup = function (editor) {
    editor.on('init', function () {
      let label = new Label;

      onBlur();

      tinymce.DOM.bind(label.el, 'click', onFocus);
      editor.on('focus', onFocus);
      editor.on('blur', onBlur);
      editor.on('change', onBlur);
      editor.on('setContent', onBlur);
      editor.on('keydown', onKeydown);

      function onFocus() {
        if (!editor.settings.readonly === true) {
          label.hide();
        }
        editor.execCommand('mceFocus', false);
      }

      function onBlur() {
        if (editor.getContent() == '') {
          label.show();
        } else {
          label.hide();
        }
      }

      function onKeydown() {
        label.hide();
      }
    });

    let Label = function () {
      let placeholder_text = editor.getElement().getAttribute("placeholder") || editor.settings.placeholder;
      let placeholder_attrs = editor.settings.placeholder_attrs || {
        style: {
          position: 'absolute',
          top: '5px',
          left: '5px',
          color: '#999',
          overflow: 'hidden',
          'white-space': 'pre-wrap',
          padding: '5px'
        }
      };
      let contentAreaContainer = editor.getContentAreaContainer();
      tinymce.DOM.setStyle(contentAreaContainer, 'position', 'relative');
      this.el = tinymce.DOM.add(contentAreaContainer, editor.settings.placeholder_tag || "label", placeholder_attrs, placeholder_text);
    }

    Label.prototype.hide = function () {
      tinymce.DOM.setStyle(this.el, 'display', 'none');
    }

    Label.prototype.show = function () {
      tinymce.DOM.setStyle(this.el, 'display', '');
    }
  }

  function Plugin() {
    tinymce.PluginManager.add('placeholder', function (editor) {
      setup(editor);
    });
  }

  Plugin();
}
  